import React, { Component } from 'react'
let { Provider, Consumer } = React.createContext();

class Demo extends Component {
  render() {
    return (
      <div>Demo
        <Provider value={{ num: 438 }}>
          {this.props.children}
          <Consumer>
            {
              ({ num }) => {
                return <Index num={num}></Index>
              }
            }
          </Consumer>
        </Provider>
      </div>

    )
  }
}
class Index extends Component {
  render() {
    return (
      <div>
        你是一个<span>{this.props.num}</span>

      </div>

    )
  }
}

export default class App extends Component {
  render() {
    return (
      <div>
        <Demo>
          <Index></Index>
        </Demo>
      </div>
    )
  }
}
